/**
 * WebSocket 封装使用示例
 *
 * 这个文件展示了如何使用 scIM.js 中的 WebSocketClient 类
 */

import WebSocketClient, {
  createWebSocket,
  getWebSocketInstance,
} from "./scIM.js";

// ============================================
// 示例 1: 基本使用
// ============================================
function example1() {
  // 创建 WebSocket 实例
  const ws = new WebSocketClient({
    url: "wss://your-websocket-server.com/ws",
    debug: true, // 开启调试日志
    heartbeatInterval: 30000, // 30秒心跳
    reconnect: true, // 开启自动重连
    reconnectInterval: 3000, // 3秒重连间隔
    reconnectMaxAttempts: 5, // 最多重连5次
  });

  // 监听连接打开事件
  ws.on("open", (res) => {
    console.log("WebSocket 已连接", res);

    // 发送消息
    ws.send("Hello Server!");

    // 发送 JSON 对象
    ws.send({
      type: "greeting",
      message: "Hello from client",
    });
  });

  // 监听消息
  ws.on("message", (data) => {
    console.log("收到消息:", data);

    // 如果是 JSON 字符串，解析它
    try {
      const parsed = JSON.parse(data);
      console.log("解析后的数据:", parsed);
    } catch (e) {
      console.log("非 JSON 数据:", data);
    }
  });

  // 监听错误
  ws.on("error", (error) => {
    console.error("WebSocket 错误:", error);
  });

  // 监听关闭
  ws.on("close", (res) => {
    console.log("WebSocket 已关闭", res);
  });

  // 开始连接
  ws.connect();

  // 返回实例供外部使用
  return ws;
}

// ============================================
// 示例 2: 在 Vue 页面中使用
// ============================================
export default {
  data() {
    return {
      ws: null,
      messages: [],
      isConnected: false,
    };
  },

  onLoad() {
    this.initWebSocket();
  },

  methods: {
    initWebSocket() {
      // 创建 WebSocket 连接
      this.ws = new WebSocketClient({
        url: "wss://your-server.com/ws",
        debug: true,
        heartbeatInterval: 30000,
        heartbeatMsg: JSON.stringify({ type: "ping" }), // 自定义心跳消息
        reconnect: true,
        reconnectInterval: 3000,
        reconnectMaxAttempts: 10,
      });

      // 监听连接状态
      this.ws.on("open", () => {
        this.isConnected = true;
        uni.showToast({
          title: "连接成功",
          icon: "success",
        });

        // 连接成功后，发送认证信息
        this.sendAuth();
      });

      // 监听消息
      this.ws.on("message", (data) => {
        this.handleMessage(data);
      });

      // 监听断开
      this.ws.on("close", () => {
        this.isConnected = false;
        uni.showToast({
          title: "连接已断开",
          icon: "none",
        });
      });

      // 监听重连
      this.ws.on("reconnect", (info) => {
        console.log(`正在重连... ${info.attempts}/${info.maxAttempts}`);
        uni.showToast({
          title: `重连中(${info.attempts})`,
          icon: "loading",
        });
      });

      // 监听错误
      this.ws.on("error", (error) => {
        console.error("WebSocket 错误:", error);
      });

      // 开始连接
      this.ws.connect();
    },

    // 发送认证信息
    sendAuth() {
      const token = uni.getStorageSync("token");
      this.ws.send({
        type: "auth",
        token: token,
      });
    },

    // 处理收到的消息
    handleMessage(data) {
      try {
        const message = JSON.parse(data);

        switch (message.type) {
          case "chat":
            // 处理聊天消息
            this.messages.push(message);
            break;
          case "notification":
            // 处理通知
            uni.showToast({
              title: message.content,
              icon: "none",
            });
            break;
          case "auth_success":
            // 认证成功
            console.log("认证成功");
            break;
          default:
            console.log("未知消息类型:", message);
        }
      } catch (e) {
        console.error("消息解析失败:", e);
      }
    },

    // 发送消息
    sendMessage(content) {
      if (!this.ws.isConnected()) {
        uni.showToast({
          title: "连接未建立",
          icon: "none",
        });
        return;
      }

      this.ws.send({
        type: "chat",
        content: content,
        timestamp: Date.now(),
      });
    },

    // 手动重连
    reconnect() {
      if (this.ws) {
        this.ws.reconnect();
      }
    },

    // 断开连接
    disconnect() {
      if (this.ws) {
        this.ws.close();
      }
    },
  },

  onUnload() {
    // 页面卸载时销毁 WebSocket
    if (this.ws) {
      this.ws.destroy();
      this.ws = null;
    }
  },
};

// ============================================
// 示例 3: 使用单例模式
// ============================================
function example3() {
  // 获取单例实例
  const ws = getWebSocketInstance({
    url: "wss://your-server.com/ws",
    debug: true,
  });

  // 监听事件
  ws.on("message", (data) => {
    console.log("收到消息:", data);
  });

  // 连接
  ws.connect();

  // 在其他地方获取同一个实例
  const sameWs = getWebSocketInstance();
  console.log(ws === sameWs); // true
}

// ============================================
// 示例 4: 高级功能
// ============================================
function example4() {
  const ws = new WebSocketClient({
    url: "wss://your-server.com/ws",
    debug: true,
  });

  ws.on("open", () => {
    // 获取连接状态
    console.log("状态:", ws.getStatusText()); // "OPEN"
    console.log("是否连接:", ws.isConnected()); // true

    // 发送消息到队列（即使已连接）
    ws.send("Message 1", true); // 强制加入队列
    ws.send("Message 2", true);

    // 手动触发发送队列中的消息
    ws.flushMessageQueue();

    // 获取队列长度
    console.log("队列长度:", ws.getMessageQueueLength());

    // 清空消息队列
    ws.clearMessageQueue();

    // 获取重连次数
    console.log("重连次数:", ws.getReconnectAttempts());

    // 重置重连次数
    ws.resetReconnectAttempts();

    // 动态更新配置
    ws.updateConfig({
      heartbeatInterval: 60000, // 改为60秒
      reconnectMaxAttempts: 10, // 改为最多重连10次
    });
  });

  ws.connect();
}

// ============================================
// 示例 5: 完整的聊天应用示例
// ============================================
class ChatService {
  constructor() {
    this.ws = null;
    this.userId = null;
    this.onMessageCallback = null;
  }

  // 初始化
  init(userId, serverUrl) {
    this.userId = userId;

    this.ws = new WebSocketClient({
      url: `${serverUrl}?userId=${userId}`,
      debug: true,
      heartbeatInterval: 30000,
      heartbeatMsg: JSON.stringify({ type: "heartbeat" }),
      reconnect: true,
      reconnectInterval: 3000,
      reconnectMaxAttempts: 0, // 无限重连
    });

    this.setupEventListeners();
    this.ws.connect();
  }

  // 设置事件监听
  setupEventListeners() {
    // 连接成功
    this.ws.on("open", () => {
      console.log("聊天服务已连接");
      // 发送在线状态
      this.sendOnlineStatus(true);
    });

    // 接收消息
    this.ws.on("message", (data) => {
      try {
        const message = JSON.parse(data);
        this.handleServerMessage(message);
      } catch (e) {
        console.error("消息解析失败:", e);
      }
    });

    // 连接关闭
    this.ws.on("close", () => {
      console.log("聊天服务已断开");
    });

    // 重连
    this.ws.on("reconnect", (info) => {
      console.log(`聊天服务重连中... ${info.attempts}`);
    });

    // 错误
    this.ws.on("error", (error) => {
      console.error("聊天服务错误:", error);
    });
  }

  // 处理服务器消息
  handleServerMessage(message) {
    switch (message.type) {
      case "chat":
        // 聊天消息
        if (this.onMessageCallback) {
          this.onMessageCallback(message);
        }
        break;
      case "user_online":
        // 用户上线
        console.log(`用户 ${message.userId} 上线了`);
        break;
      case "user_offline":
        // 用户下线
        console.log(`用户 ${message.userId} 下线了`);
        break;
      case "typing":
        // 对方正在输入
        console.log(`用户 ${message.userId} 正在输入...`);
        break;
      default:
        console.log("未知消息类型:", message);
    }
  }

  // 发送聊天消息
  sendChatMessage(toUserId, content) {
    if (!this.ws.isConnected()) {
      console.error("连接未建立");
      return false;
    }

    this.ws.send({
      type: "chat",
      fromUserId: this.userId,
      toUserId: toUserId,
      content: content,
      timestamp: Date.now(),
    });

    return true;
  }

  // 发送在线状态
  sendOnlineStatus(isOnline) {
    this.ws.send({
      type: isOnline ? "online" : "offline",
      userId: this.userId,
      timestamp: Date.now(),
    });
  }

  // 发送正在输入状态
  sendTypingStatus(toUserId) {
    this.ws.send({
      type: "typing",
      fromUserId: this.userId,
      toUserId: toUserId,
      timestamp: Date.now(),
    });
  }

  // 设置消息回调
  onMessage(callback) {
    this.onMessageCallback = callback;
  }

  // 断开连接
  disconnect() {
    if (this.ws) {
      this.sendOnlineStatus(false);
      this.ws.close();
    }
  }

  // 销毁
  destroy() {
    if (this.ws) {
      this.sendOnlineStatus(false);
      this.ws.destroy();
      this.ws = null;
    }
  }

  // 获取连接状态
  isConnected() {
    return this.ws && this.ws.isConnected();
  }
}

// 使用聊天服务
function useChatService() {
  const chatService = new ChatService();

  // 初始化
  chatService.init("user123", "wss://chat.example.com/ws");

  // 监听消息
  chatService.onMessage((message) => {
    console.log("收到新消息:", message);
    // 显示消息UI
  });

  // 发送消息
  chatService.sendChatMessage("user456", "Hello!");

  // 发送正在输入状态
  chatService.sendTypingStatus("user456");

  // 断开连接
  // chatService.disconnect();
}

// ============================================
// 示例 6: 自定义心跳响应判断
// ============================================
function example6() {
  const ws = new WebSocketClient({
    url: "wss://your-server.com/ws",
    debug: true,
    heartbeatInterval: 30000,
    heartbeatMsg: JSON.stringify({
      type: "heartbeat",
      timestamp: Date.now(),
    }),
  });

  // 重写心跳消息判断方法（如果默认的不满足需求）
  ws.isHeartbeatMessage = function (data) {
    try {
      const parsed = JSON.parse(data);
      // 自定义判断逻辑
      return parsed.type === "heartbeat" && parsed.response === "ok";
    } catch (e) {
      return false;
    }
  };

  ws.connect();
}

// ============================================
// 示例 7: 发送二进制数据
// ============================================
function example7() {
  const ws = new WebSocketClient({
    url: "wss://your-server.com/ws",
    debug: true,
    binaryType: "arraybuffer", // 设置二进制类型
  });

  ws.on("open", () => {
    // 发送 ArrayBuffer
    const buffer = new ArrayBuffer(8);
    const view = new DataView(buffer);
    view.setInt32(0, 42);
    ws.send(buffer);
  });

  ws.on("message", (data) => {
    if (data instanceof ArrayBuffer) {
      console.log("收到二进制数据:", data);
      const view = new DataView(data);
      console.log("解析数据:", view.getInt32(0));
    }
  });

  ws.connect();
}

export {
  example1,
  example3,
  example4,
  example6,
  example7,
  ChatService,
  useChatService,
};
